<script setup>
import {ref} from 'vue'
const abc = ref(false)

</script>
<template>
  <button @click="abc=true">set box red</button>
  <button @click.right="red=true">set box red</button>
  <button @click.middle="red=true">set box red</button>
  <!-- :style="{background:red?'red':'black'}" -->
  <div class="box" :class="{abc}" ></div>
</template>

<style>
.box{
  width: 50px;
  height: 50px;
  background-color: #00f;
}

.red{
  width: 50px;
  height: 50px;
  background-color: #f00;
}
</style>
